<!DOCTYPE html>
<!--[if lte IE 9]><html class="lt-ie10 lt-ie9" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if gt IE 9]><!-->
<html>
<!--<![endif]-->

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>赛尔（赛er）—竞赛详情</title>
    <meta name="keywords" content="赛尔（赛er）是一个面向全国各大高校大学生的一站式社区平台，集竞赛活动发布和讨论为一体，提供发布、查询、组队、经验分享等多元化服务。" />
    <meta name="description"
          content="平台聚合了国内各大高校的校内比赛以及国内外各领域最优质的赛事活动信息。赛事内容囊括创新创业、演讲辩论、财会金融、艺术设计、学科竞赛、公益志愿等众多领域。赛尔（赛er）致力于打造一个融合大学生学习、赛事、活动、保研、考研等为一体的成长交流空间。" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Access-Control-Allow-Origin" content="*" />
    <meta name="renderer" content="webkit">

    <link rel="stylesheet" type="text/css" href="/static/css/top-4.9.6.2.min.css">
    <link rel="stylesheet" type="text/css" href="/static/css/active.min.css">
    <link rel="stylesheet" type="text/css" href="/static/css/monokai_sublime.min.css">
    <link rel="stylesheet" type="text/css" href="/static/css/newcss.css">

    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
    <script src="/common/common.js"></script>

    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

    <style>
        .my-reply {
            padding: 10px;
            background-color: #fafbfc;
        }

        .my-reply .header-img {
            display: inline-block;
            vertical-align: top;
        }

        .my-reply .reply-info {
            display: inline-block;
            margin-left: 5px;
            width: 90%;
        }
        .info-name{
            font-weight: bold;
        }
        @media screen and (max-width: 1200px) {
            .my-reply .reply-info {
                width: 80%;
            }
        }

        .my-reply .reply-info .reply-input {
            margin-top:5px;
            min-height: 20px;
            line-height: 22px;
            padding: 10px 10px;
            color: #ccc;
            background-color: #fff;
            border-radius: 5px;
        }

        .my-reply .reply-info .reply-input:empty:before {
            content: attr(placeholder);
        }

        .my-reply .reply-info .reply-input:focus:before {
            content: none;
        }

        .my-reply .reply-info .reply-input:focus {
            padding: 8px 8px;
            border: 2px solid skyblue;
            box-shadow: none;
            outline: none;
        }

        .my-reply .reply-btn-box {
            height: 25px;
            display: inline-block;
        }

        .my-reply .reply-btn-box .reply-btn {
            position: relative;
            float: right;
            margin-left: 15px;
        }

        .my-comment-reply {
            margin-left: 50px;
        }

        .my-comment-reply .reply-input {
            width: flex;
        }

        .author-title:not(:last-child) {
            border-bottom: 1px solid rgba(74, 136, 199, 0.3);
        }

        .reply-father {
            padding: 10px;
        }

        .reply-father .header-img {
            display: inline-block;
            vertical-align: top;
        }

        .reply-father .author-info {
            display: inline-block;
            margin-left: 5px;
            width: 60%;
            height: 40px;
            line-height: 20px;
        }

        .reply-father .author-info span {
            display: block;
            cursor: pointer;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .reply-father .author-info .author-name {
            color: #000;
            font-size: 18px;
            font-weight: bold;
        }

        .reply-father .author-info .author-time {
            font-size: 14px;
        }

        .reply-father .icon-btn {
            width: 30%;
            padding: 0 !important;
            float: right;
        }

        @media screen and (max-width: 1200px) {
            .reply-father .icon-btn {
                width: 20%;
                padding: 7px;
            }
        }

        .reply-father .icon-btn span {
            cursor: pointer;
        }

        .reply-father .icon-btn .iconfont {
            margin: 0 5px;
        }

        .reply-father .talk-box {
            margin: 0 50px;
        }

        .reply-father .talk-box p {
            margin: 0;
        }

        .reply-father .talk-box .reply {
            font-size: 16px;
            color: #000;
        }

        .reply-father .reply-box {
            margin: 10px 0 0 50px;
            background-color: #efefef;
        }
        .layui-container{
            border: 1px solid #ededed;
            border-radius: 4px;
            background: #fbfbfb;
            padding: 38px 39px;
            height: 100px;
            font-size: 20px;
            margin-bottom: 30px;
            margin-top:30px;

        }
        a:hover{color:#1E90FF;}
    </style>

</head>

<body>
<!--body-wrap-->
<div class="body-wrap">
    <div id="app" class="body-main main-wrap v-4-2">
        <ul class="layui-nav layui-bg-cyan" style="margin: 0 auto;padding:0 12%" lay-filter="">
            <li style="display: inline-block;line-height: 60px;vertical-align: middle;position: relative;"><a
                    href="/index.html"><img style="height: 60px;margin-right:15px;" src="/static/images/logo.png"></a></li>
            <!-- 选中 加上 layui-this -->
            <li class="layui-nav-item"><a href="/index.html">首页</a></li>
            <li class="layui-nav-item layui-this"><a href="/competition/competition.html">竞赛</a></li>
            <li class="layui-nav-item"><a href="/activity/activity.html">活动</a></li>
            <li class="layui-nav-item"><a href="/ask/ask.html">论坛</a></li>
            <li class="layui-nav-item"><a href="/article/article.html">文章</a></li>
            <li class="layui-nav-item" v-if="user!=''&&user!=null&&user!=undefined">
                <a href="javascript:;">发布</a>
                <dl class="layui-nav-child">
                    <!-- 二级菜单 -->
                    <dd><a href="/competition/publish_competition.html">创建竞赛</a></dd>
                    <dd><a href="/activity/publish_activity.html">发布活动</a></dd>
                    <dd><a href="/ask/publish_ask.html">发起提问</a></dd>
                    <dd><a href="/article/publish_article.html">发表文章</a></dd>
                </dl>
            </li>
            <template v-if="user!=''&&user!=null&&user!=undefined">
                <li class="layui-nav-item" style="float: right">
                    <a href="javascript:;" style="padding: 0 20px 0 0px">
                        <img :src="NGINX_SERVER+user.AVATAR" class="layui-nav-img">
                        {{user.NAME}}
                    </a>
                    <dl class="layui-nav-child">
                        <dd><a href="/user/my_home.html">我的主页</a></dd>
                        <dd><a href="javascript:void(0);" style="color:red" onclick="logout()">退出登录</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item" style="float: right;margin-right: 25px;">
                    <a  href="/user/my_msg.html" style="cursor: pointer;"><i
                            class="layui-icon layui-icon-notice" style="font-size: 18px;"></i><span class="layui-badge"
                                                                                                    v-if="unreadCount>0">{{unreadCount}}</span></a>
                </li>
            </template>
            <template v-else>
                <li style="float:right" class="layui-nav-item"><a href="/login.html">登录</a></li>
                <li style="float:right" class="layui-nav-item"><a href="/reg.html">注册</a></li>
            </template>
        </ul>
<br>
        <h2 style="text-align: center;font-size: 30px">{{Announcement.TITLE}}</h2>
        <template>
            <div class="sk-active-box clearfix">
                <div class="sidebar-a fl">
                    <!-- 竞赛内容 -->
                    <div class="active-detail-box">
                        <div class="title-box">
                            <h3 class="title">公告内容</h3>
                        </div>
                        <div class="active-detail-text-box text-body clearfix" v-html="Announcement.CONTENT">
                        </div>
                    </div>
                    <div class="active-detail-box event4-1-discuss">
                        <div class="title-box">
                            <h3 class="title">附件下载</h3>
                        </div>
                        <div class="active-detail-text-box text-body clearfix">

                            <a target="_blank" :href="BaseUrl+'api/base/downloadFile?path='+Announcement.ATTACH_URL+'&attname='+Announcement.ATTACH_NAME">{{Announcement.ATTACH_NAME}}</a>

                            </div>
                        </div>
                    </div>

                <div class="sidebar-b fr">
                    <div class="sidebar-b-con">
                        <div class="title-box">
                            <h3 class="title">公告信息</h3>
                        </div>
                        <div class="new-active-box">
                            <ul class="new-active-list">
                                <li class="new-active-info-item clearfix">
                                    <span class="info-name fl">公告标题：</span>
                                    <div class="info-content fl">
                                        <p>{{Announcement.TITLE}}</p>
                                    </div>
                                </li>
                                <li class="new-active-info-item clearfix">
                                    <span class="info-name fl">发布时间：</span>
                                    <div class="info-content fl">
                                        <p>{{Announcement.CREATE_TIME}}</p>
                                    </div>
                                </li>
                                <li class="new-active-info-item clearfix">
                                    <span class="info-name fl">更新时间：</span>
                                    <div class="info-content fl">
                                        <p>{{Announcement.UPDATE_TIME}}</p>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                </div>

        </template>
    </div>
    <div class="footer-wrap v-4-2">
        <div class="footer other">
            <div class="common-box footer-box">
                <div class="to-top-box" id="toUpBox">
                    <!--<a href="javascript:;" target="_blank" class="common-icon-big to-feedback-btn" title="意见反馈"></a>-->
                    </a>
                    <div class="iradio-2 to-msite-btn to-msite-btn-2" title="微信公众号">
            <span class="weixin-box" style="margin-top: -42px;">
              <img src="/static/images/erweima.jpg" alt="微信公众号">
              <span class="weixin-txt">关注赛er订阅号</span>
              <img src="/static/images/kefu.jpg" alt="微信客服">
              <span class="weixin-txt">添加赛er客服</span>
              <span class="arrow arrow-right boxL-cor" style="margin-top: -70px;"></span>
            </span>
                    </div>
                    <a href="javascript:;" class="to-top-btn common-icon-big" id="toUp" title="返回顶部"></a>
                </div>
                <div class="fl ft-info-box">
                    <div class="ft-tit" title="关于赛er">关于赛er</div>
                    <ul class="ft-list">
                        <li class="item">
                            <a href="" title="了解赛er" target="_blank" rel="nofollow">了解赛er</a>
                        </li>
                        <li class="item">
                            <a href="./contact.html" title="服务协议" target="_blank" rel="nofollow">服务协议</a>
                        </li>
                        <li class="item">
                            <a href="" title="合作伙伴" target="_blank" rel="nofollow">合作伙伴</a>
                        </li>
                        <li class="item">
                            <a href="" title="加入我们" target="_blank" rel="nofollow">加入我们</a>
                        </li>
                        <li class="item">
                            <a href="" title="隐私协议" target="_blank" rel="nofollow">隐私协议</a>
                        </li>
                    </ul>
                </div>
                <div class="fl ft-info-box">
                    <div class="ft-tit" title="帮助中心">帮助中心</div>
                    <ul class="ft-list">
                        <li class="item">
                            <a href="" title="常见问题" target="_blank" rel="nofollow">常见问题</a>
                        </li>
                        <li class="item">
                            <a href="./legal.html" title="社区规范" target="_blank" rel="nofollow">社区规范</a>
                        </li>
                        <li class="item">
                            <a href="" title="意见反馈" target="_blank" rel="nofollow">意见反馈</a>
                        </li>
                    </ul>
                </div>
                <div class="fr ft-info-box" style="width: 200px;">
                    <div class="ft-tit" title="在线客服">联系我们</div>
                    <ul class="ft-list">
                        <li class="item">
                            赛er<span class="item-dot"></span>客服QQ：<a href="https://wpa.qq.com/msgrd?v=3&uin=412414867&site=qq&menu=yes">412414867</a>
                        </li>
                        <li class="item">
                            赛er<span class="item-dot"></span>官方QQ群：320513949
                        </li>
                    </ul>
                </div>

            </div>
        </div>
        <!-- 备案 footer -->
        <div class="ft-btm">
            <div class="common-box ft-btm-box">
                <div class="btn-con">
                    <span class="ft-paragraph">©<span id="nowYear"></span>赛er<span class="s-4"></span></span>
                    <span><a href="https://beian.miit.gov.cn/" target="_blank" style="color: #555;">苏ICP备2021019825号</a></span>
                </div>
            </div>
        </div>
    </div>
</div>


<script>
  toTopFun();
</script>
</body>
<script src="/static/js/highlight.pack.js"></script>
<script src="/static/js/jquery-1.10.2.min.js"></script>

<!--vue-->
<script>
    const clickoutside = {
        // 初始化指令
        bind(el, binding, vnode) {
            function documentHandler(e) {
                // 这里判断点击的元素是否是本身，是本身，则返回
                if (el.contains(e.target)) {
                    return false
                }
                // 判断指令中是否绑定了函数
                if (binding.expression) {
                    // 如果绑定了函数 则调用那个函数，此处binding.value就是handleClose方法
                    binding.value(e)
                }
            }
            // 给当前元素绑定个私有变量，方便在unbind中可以解除事件监听
            el.vueClickOutside = documentHandler
            document.addEventListener('click', documentHandler)
        },
        update() { },
        unbind(el, binding) {
            // 解除事件监听
            document.removeEventListener('click', el.vueClickOutside)
            delete el.vueClickOutside
        },
    }
    const app = new Vue({
        el: "#app",
        data: {
            user: '',
            NGINX_SERVER: NGINX_SERVER,
            Announcement:{
                TITLE:'',
                CONTENT:'',
                CREATE_TIME:'',
                UPDATE_TIME:'',
                ATTACH_URL:'',
                ATTACH_NAME:'',
                COMPETITION_ID:'',
                NOTICE_ID:'',
            }
        },
        directives: { clickoutside },
        methods: {
            //获取竞赛
            getAnnouncement() {
                let _this = this;
                let id = { "NOTICE_ID": getUrlParam("id") };
                //alert(id);
                getDataByPost("api/competition/noticeDetail", id, function (res) {
                    _this.Announcement = res.data;
                })
            },
            getUser() {
                this.myName = this.user.NAME;
                this.myHeader = this.NGINX_SERVER + this.user.AVATAR;
                this.myId = this.user.USER_ID;
                this.$forceUpdate();
            }
        },
        //生命周期相关函数
        created() {
            this.getAnnouncement();
            var user = JSON.parse(sessionStorage.getItem("userInfo"));
            this.getUser();
        }
    })

    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function () {
        var element = layui.element;

        //…
    });
</script>

</html>